class Index {
    constructor(domId) {
        this.$container = $('#container'); //需要转换为图片的容器
        this.$toCanvasBtn = $('#toCanvasBtn'); //点击转换容器为画布的元素
        this.$toImageBtn = $('#toImageBtn'); //点击转换画布为图片的元素
        this.$saveImageBtn = $('#saveImageBtn'); //点击转换画布为图片的元素
        this.$saveBox = $('#saveBox'); //点击保存图片的容器
        this.toCanvas(); //初始化
    }

    /* 元素转canvas */
    toCanvas() {
        this.$toCanvasBtn.click(e => {
            html2canvas(this.$container[0]).then(canvas => {
                this.toImage(canvas);
                this.toImage(canvas);
            });


        });
    }

    /* canvas转图片 */
    toImage(canvas) {
        this.$toImageBtn.click(e => {
            this.saveImage(canvas); //保存图片
        });
    }

    /* 保存图片 */
    saveImage(canvas) {

        this.$saveImageBtn.click(e => {
            let type = "png"; //图片类型
            let w = $("#container").outerHeight(true); //图片宽度
            let h = $("#container").outerWidth(true);; //图片高度
            let f = "ofsdgiklglsk"; //图片文件名

            Canvas2Image.saveAsImage(canvas, w, h, type, f); //调用Canvas2Image插件
        });
    }
};

new Index();